<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>读者详情 - 图书管理系统</title>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/css/bootstrap.min.css">
</head>
<body>
<nav th:replace="fragments/navbar :: navbar"></nav>

<div class="container mt-4">
    <div class="row mb-4">
        <div class="col-md-6">
            <h2>读者详情</h2>
        </div>
        <div class="col-md-6 text-right">
            <a href="/readers" class="btn btn-secondary">返回列表</a>
        </div>
    </div>

    <div class="card">
        <div class="card-body">
            <div class="row">
                <div class="col-md-12">
                    <h3 th:text="${reader.name}" class="mb-3"></h3>
                    <p><strong>ID：</strong><span th:text="${reader.id}"></span></p>
                    <p><strong>电话：</strong><span th:text="${reader.phone ?: '无'}"></span></p>
                    <p><strong>邮箱：</strong><span th:text="${reader.email ?: '无'}"></span></p>
                    <p><strong>地址：</strong><span th:text="${reader.address ?: '无'}"></span></p>
                    <p><strong>状态：</strong>
                        <span class="badge" th:classappend="${reader.active ? 'badge-success' : 'badge-danger'}"
                              th:text="${reader.active ? '正常' : '禁用'}"></span>
                    </p>
                    <p><strong>注册时间：</strong><span th:text="${#temporals.format(reader.createTime, 'yyyy-MM-dd HH:mm:ss')}"></span></p>
                    <p><strong>最后更新：</strong><span th:text="${#temporals.format(reader.updateTime, 'yyyy-MM-dd HH:mm:ss')}"></span></p>
                </div>
            </div>
            <div class="mt-4 text-right">
                <a th:href="@{/readers/edit/{id}(id=${reader.id})}" class="btn btn-warning mr-2">编辑</a>
                <a th:href="@{/readers/delete/{id}(id=${reader.id})}" class="btn btn-danger"
                   onclick="return confirm('确定要删除该读者吗？')">删除</a>
            </div>
        </div>
    </div>
</div>

<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>